// 消息列表
<template>
 <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
    <div>
       
        <div class="top2">
            <van-nav-bar title="消息列表" left-text="返回" left-arrow :fixed='true' @click-left="onClickLeft" :border='false'>
            <van-icon name="arrow-left" slot="left" color="black" />
            </van-nav-bar>
        </div>
        <div class="box2">
           <p class="tent">
               <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>106900642154</p><span>周三下午4:14</span></h2>
                <p>尊敬的游资客户，您的外卖已送达...</p>
            </div> 
        </div>
         <div class="box2">
           <p class="tent">
           <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>106981658551</p><span>周六下午8:18</span></h2>
                <p>尊敬的游资客户，拘票是汇报贡品已...</p>
            </div> 
        </div>
         <div class="box2">
           <p class="tent">
           <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>194816519088</p><span>周一下午3:50</span></h2>
                <p>尊敬的游资客户，你的水果已按时送到...</p>
            </div> 
        </div>
         <div class="box2">
           <p class="tent">
          <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>108498989848</p><span>周一上午9:10</span></h2>
                <p>尊敬的游资客户，你的快递已准时发出...</p>
            </div> 
        </div>
         <div class="box2">
           <p class="tent">
           <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>10198898554</p><span>周四下午2:14</span></h2>
                <p>尊敬的游资客户，购买的商品正在配送...</p>
            </div> 
        </div>
         <div class="box2">
           <p class="tent">
          <img src="https://img.yzcdn.cn/vant/cat.jpeg" alt="">
            </p>
            <div class="tent1">
                <h2><p>10690064154</p><span>周日下午10:54</span></h2>
                <p>尊敬的游资客户，服务器响应错误...</p>
            </div> 
        </div>
        
    </div>
</van-pull-refresh>
</template>
<script>
    export default{
        data(){
            return{
               isLoading: false
            }
        },
        methods:{
            onClickLeft(){
                console.log(1)
				this.$router.go(-1)
            },
             onRefresh() {
            setTimeout(() => {
                this.$toast('刷新成功');
                this.isLoading = false;
                this.count++;
            }, 500);
            }
        }
    }

</script>


<style>
    .tent img{width: 1.5rem;height: 1.5rem;border-radius:50% }
    .tent1 h2{width: 100%;display: flex;font-size: 16px;justify-content: space-between;padding-bottom: 3%}
    .tent1{width: 80%; display: flex;flex-direction: column;padding-left:5%;align-items: flex-start}
    .tent1 span{color: #ccc;font-size: 11px;}
    *{margin: 0 ;padding:0;}
    .top2{border-bottom:3px solid rgba(99, 96, 96, 0.034);margin-top: 1.5rem;}
    .box2{padding-top:.4rem;display: flex;border-bottom: 1px solid #ccc;margin: 3% 5%;}
    
   
    
    
    
</style>